
class Main extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [],
            name: '',
            id: 0,
            start: 1,
            pagesize: 15,
            counts: [],
        };
    }

    formatlist(list) {
        console.log(list, 'list');

        var listitem = [], that = this, wulist = [];
        if (list.length > 0) {
            list.forEach((x, i) => {
                let state = x.state == 'APPLYING' ? '待付款' : '已付款'
                listitem.push(
                    <tr key={i}>
                        <td>{x.nickname}</td>
                        <td>{(x.price / 100).toFixed(2)}</td>
                        <td>{getLocalTime(new Date(x.updateDate * 1000))}</td>
                        <td style={{ color: state == '已付款' ? '#669900' : state == '待付款' ? '#f00' : '#000' }}>{state}</td>
                        {/* <td>{x.scorefrom+"~"+x.scoreto}</td>  */}
                        <td className="operatebox">
                            <div className='operate' id={"ope" + x.id}>
                                {/* <div >
                            <img src="./src/edit.png"/>
                            <p className='edit' onClick={that.todetail.bind(this,x.apply.id)}>详情</p>
                        </div> */}

                                <div style={{ display: x.state == 'APPLYING' ? '' : 'none' }}  >
                                    {/* <img src="./src/edit.png"/> */}
                                    <p className='edit' onClick={that.confirm.bind(this, x.id)}>付款</p>
                                </div>
                                {/* <div onClick={that.cancal.bind(this,x.apply.id)} style={{display:x.apply.state=='APPLYING'?'':'none'}}  data-toggle="modal" data-target="#modalOne">
                            <p className='edit colred'  >拒绝</p>
                        </div> */}
                                <div>
                                    <img src="./src/del.png" />
                                    <p className='edit colred' onClick={that.del.bind(this, x.id)}>删除</p>
                                </div>


                            </div>
                        </td>
                    </tr>
                )
            });
        } else {
            wulist.push(
                <p className="wulist">暂无数据</p>
            )
        }
        this.setState({ listitem, list, originallist: list, wulist })
    }
    confirm(e) {
        this.setState({ confirmid: e,content:'提现' }, () => {
            $('#myModal').modal('toggle');
        })
        // let that = this
        // WithdrawalApplysetstate(e,res=>{
        //     if(res.issuccess==1){
        //         alert('操作成功')
        //         that.freshlist(that.state.start)  
        //     }
        // })

    }
    cancal(e) {
        console.log(e, 'cancel')
        this.setState({ refuseid: e })
    }
    // 编辑
    todetail(e) {
        window.location.href = './applydetail.html?id=' + e
    }
    // 删除
    del(e) {
        this.setState({ delid: e,content:'删除' }, () => {
            $('#myModal').modal('toggle');
        })
    }
    confirmdel() {
        let {content,start}=this.state
        this.setState({ showloading: 'ON' })
        if(content=='提现'){
            let { confirmid, } = this.state
            Withdrawalsetstate(confirmid, res => {
                this.setState({ showloading: '' })
                if (res.issuccess == 1) {
                    alert('提现成功')
                    $('#myModal').modal('toggle');
                    this.freshlist(start)
                } else {
                    $('#myModal').modal('toggle');
                    alert(res.msg);
                }
            })
        }else{
            let { delid } = this.state
            Withdrawaldel(delid, res => {
                this.setState({ showloading: '' })
                if (res.issuccess == 1) {
                    alert('删除成功')
                    $('#myModal').modal('toggle');
                    this.freshlist(start)
                } else {
                    $('#myModal').modal('toggle');
                    alert(res.msg);
                }
            })
        }
       
       
    }

    componentDidMount() {
        this.setState({ showloading: 'ON' })
        this.freshlist(1)
    }
    freshlist(start) {
        let { pagesize } = this.state
        Withdrawalgetlist({ start, pagesize }, res => {
            this.setState({ showloading: '' })
            if (res.issuccess == 1) {
                if (start == 1) {
                    let pagecount = Math.ceil(res.total / pagesize);
                    this.setpager(pagecount, start);
                    this.setState({ start, total: res.total })
                }
                this.formatlist(res.list);
            }
        })

    }
    setpager(pagecount, start) {
        let counts = [];
        for (let i = 0; i < pagecount; i++) {
            counts.push(start + i)
        }
        this.setState({ counts, pagestart: 0 })
    }
    clickpage(e) {
        this.setState({ showloading: 'ON' })
        let { start, pagesize } = this.state
        start = e * pagesize
        this.setState({ pagestart: e, start }, () => {
            this.freshlist(start)
        })
    }
    setpage(e) {
        this.setState({ showloading: 'ON' })
        let { pagesize, start } = this.state
        pagesize = parseInt(e)
        start = 1
        this.setState({ pagesize, start }, () => {
            this.freshlist(start)
        })
    }

    inputchange(prop, e) {
        // let { target } = this.state;
        // target[prop] = e.target.value
        // this.setState({ target })
        this.setState({ [prop]: e.target.value })
    }
    reasonsubmit() {
        let { refuseid, reason } = this.state, data = { id: refuseid, reason }, that = this;
        checkapply(data, res => {
            if (res.issuccess == 1) {
                alert('操作成功')
                that.freshlist(that.state.start)
            }
        })
        console.log(data, 'reasonsubmit');

    }
    add() {
        $('#modalOne').modal('toggle');
    }
    render() {
        let { listitem, reason, counts, pagestart,content } = this.state;

        return (
            <div className="breadLinebox">
                 <Modal content={"确定要"+content+"吗？"} click={this.confirmdel.bind(this)} />
                {/* <Modal content='确定要提现吗？' click={this.confirmdel.bind(this)} /> */}
                <Loading hidden={this.state.showloading != 'ON'} />
                <div className="modal fade" id="modalOne" >
                    <div className="modal-dialog">
                        <div className="modal-content">

                            <div className="modal-body">
                                <div className="input-group">
                                    <span className="input-group-addon">拒绝理由</span>
                                    <input id='name' onChange={this.inputchange.bind(this, 'reason')} value={reason} type="text" placeholder='请输入拒绝理由' className="input" />
                                </div>

                            </div>
                            <div className="modal-footer border">
                                <button type="button" className="closemod" data-dismiss="modal">关闭</button>
                                <button type="button" onClick={this.reasonsubmit.bind(this)} data-dismiss="modal" className="submitmod">提交</button>
                            </div>

                        </div>
                    </div>
                </div>


                <div className='content_wrap panel-default content_wrap'>
                    <div className="breadLine">
                        <div className="img">
                            <img src='./src/lm_order1.png' />
                            提现管理
                        </div>
                    </div>
                    <div className="content">
                        {/* <div className="tabletit">
                            <p className="add" data-toggle="modal" data-target="#modalOne" onClick={this.add.bind(this)}>新建</p>
                        </div> */}
                        <table className="tab">
                            <thead>
                                <tr>
                                    <th>用户姓名</th>
                                    <th>申请金额</th>
                                    <th>申请时间</th>
                                    <th>状态</th>
                                    <th className="cz tconter">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                {listitem}
                            </tbody>
                        </table>
                        {this.state.wulist}
                        <div className="pagerbox">
                            <p>共{this.state.total}条</p>
                            <Pager counts={counts} click={this.clickpage.bind(this)} change={this.setpage.bind(this)} index={pagestart} />
                        </div>
                    </div>
                </div>
            </div>


        )


    }
}





ReactDOM.render(
    <div>
        <TopLine />
        <div id='body'>
            <LeftMenu code='withdrawal' />
            <Main />
        </div>
    </div>
    // <Barrage/>
    , $('.container')[0]
)